<!DOCTYPE html>

<html xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	xmlns:c="http://java.sun.com/jsp/jstl/core">


<h:head>

	<style type="text/css">
.content {
	position: relative;
	width: 100%;
	margin: 0 auto;
}

.ui-layout,.ui-layout-doc,.ui-layout-unit,.ui-layout-wrap,.ui-layout-bd,.ui-layout-hd
	{
	border: none;
}

body {
	margin: 3% 7% 3% 7%;
}

.ui-widget,.ui-widget .ui-widget {
	font-size: 95%;
}

.ui-panelmenu-header,.ui-menuitem-text {
	font-size: 10pt
}

.companyHeaderGrid tr,.companyHeaderGrid td {
	border: none;
}
</style>

</h:head>

<h:body>
	<img class="content" src="#{resource['images/top.jpg']}" alt="immagine top"></img>

	<!-- Importo il css per la customizzazione della pagina -->
	<h:outputStylesheet name="css/custom.css" />

	<!-- Evento che mi permette di caricare i trasporti dal DB prima di renderizzare la pagina -->
	<f:view contentType="text/html">
		<f:event type="preRenderView"
			listener="#{trasportoBean.caricaTrasporti}" />
	</f:view>

	<p:layout fullPage="false" style=" min-width: 90%; min-height:600px;">

		<p:layoutUnit position="north"
			style="min-height:100px; font-size: 13pt">
			<p:toolbar>
				<p:toolbarGroup align="right">
					<h:form>
						<p:commandButton id="logoutButton" value="Logout"
							icon="ui-icon-play" action="#{logoutBean.logout}" />
					</h:form>
				</p:toolbarGroup>
			</p:toolbar>
		</p:layoutUnit>


		<!-- START - ZONA SX DELLA PAGINA -->


		<p:layoutUnit position="west" collapsible="true" size="22%" gutter="0">

			<!-- Inserisco dal file left_menu (della cartella corrente) il menu con i comandi -->
			<ui:insert name="left-menu">
				<div style="padding: 0px 0px 0px 0px">
					<ui:include src="left_menu.xhtml" />
				</div>
			</ui:insert>

		</p:layoutUnit>


		<!-- STOP - ZONA SX DELLA PAGINA -->

		<!-- START - ZONA DX DELLA PAGINA -->

		<p:layoutUnit position="center" collapsible="true" size="22%"
			gutter="0" style="min-heigth: 900px">


			<p:tabView id="tab_view_id" dynamic="true" cache="false"
				style="border: none">

				<p:ajax event="tabChange" listener="#{escursioneBean.onTabChange}" />

				<p:ajax event="tabChange" listener="#{alloggioBean.onTabChange}" />

				<p:tab id="trasporto_tab" title="Trasporti Singoli">

					<ui:insert name="nuovo_trasporto">
						<ui:include src="trasporti_list.xhtml" />
					</ui:insert>

				</p:tab>

				<p:tab id="alloggio_tab" title="Alloggi">
					<ui:insert name="nuovo_trasporto">
						<ui:include src="alloggi_list.xhtml" />
					</ui:insert>
				</p:tab>

				<p:tab id="escurione_tab" title="Escursioni">

					<ui:insert name="nuovo_trasporto">
						<ui:include src="escursioni_list.xhtml" />
					</ui:insert>
				</p:tab>

			</p:tabView>



		</p:layoutUnit>
		<!-- STOP - ZONA DX DELLA PAGINA -->
	</p:layout>
	<img class="content" src="#{resource['images/bottom.jpg']}" alt="immagine top"></img>

</h:body>
</html>